<template>
  <div>
    <a-modal v-model="visible" destroyOnClose :maskClosable="false" :title="title" @ok="handleOk" :confirm-loading="confirmLoading" :footer="disabled?null:undefined" width="600px">
      <a-form-model :model="form" :rules="rules" v-bind="modelConfig">
        <a-form-model-item label="接口名称" prop="reqName">
          <a-input v-model="form.reqName" :disabled="disabled" placeholder="请输入接口名称" />
        </a-form-model-item>
        <a-form-model-item ref="reqUrl" label="请求url" prop="reqUrl">
          <a-input v-model="form.reqUrl" :disabled="disabled" placeholder="请输入请求url(支持正则表达式)" />
        </a-form-model-item>
        <a-form-model-item label="请求url描述" prop="description">
          <a-input type="textarea" v-model="form.description" :disabled="disabled" placeholder="请输入请求url描述" />
        </a-form-model-item>
        <a-form-model-item label="是否生效" prop="isActive">
          <a-radio-group name="radioGroup" v-model="form.isActive" :disabled="disabled">
            <a-radio v-for="item in status" :key="item.isActive" :value="item.isActive">
              {{ item.label }}
            </a-radio>
          </a-radio-group>
        </a-form-model-item>
      </a-form-model>
    </a-modal>
  </div>
</template>

<script>

import { CommonModal } from '@/ryweb'
export default {
  name: 'UrlModal',
  mixins: [CommonModal],
  props: ['url', 'status'],
  data () {
    return {
      Visible: false,
      confirmLoading: false,
      title: '新增白名单',
      disableSubmit: true,
      form: {},
      rules: {
        reqName: [
          { required: true, message: '请输入接口名称', trigger: 'blur' }
        ],
        reqUrl: [
          { required: true, message: '请输入url', trigger: 'blur' },
          { max: 128, message: '最大长度128字符', trigger: 'blur' }
        ],
        description: [
          { max: 256, message: '最大长度256字符', trigger: 'blur' }
        ],
        isActive: [
          { required: true, message: '请选择', trigger: 'blur' }
        ]
      }
    }
  },
  created () {
  },
  mounted () {
  },
  methods: {

  }
}
</script>

<style scoped>
</style>
